﻿<style>
    .padding5 {
        padding-left: 5px;
        padding-right: 5px;
    }

    .mb7_top {
        padding: 0.4rem 0;
        font-family: "STHeiti","Microsoft YaHei","黑体","arial";
        background: #000;
        color: #fff;
        text-align: center;
        font-size: 1.2rem;
    }

    .swiper-container {
        width: 100%;
        background: #fff;
    }

    .swiper-slide {
        display: block;
        width: 100%;
        margin-right: 0px;
        padding-top: 46.875%;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center; /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

        .swiper-slide a {
            display: block;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0px;
            left: 0px;
        }

    .swiper-pagination-bullet {
        width: 8px;
        height: 2px;
        border-radius: 0px;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px; /*box-shadow: rgba(0,0,0,.5) 0 0 7px;*/
    }

    .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0 3px;
    }

    .mb7_banner .swiper-slide a {
    }

        .mb7_banner .swiper-slide a img {
            max-width: 100%;
        }

    .mb7_list {
        font-family: "STHeiti","Microsoft YaHei","黑体","arial";
        background: #fff;
    }

        .mb7_list ul {
            padding-left: 0;
            list-style: none;
        }

        .mb7_list li {
            float: left;
            width: 33.3333%;
        }

            .mb7_list li a {
                display: block;
                padding: 0.5rem 0;
                text-align: center;
                border-right: 1px solid #ddd;
                border-bottom: 1px solid #ddd;
                font-size: 0.8rem;
                color: #333;
            }

                .mb7_list li a span {
                    font-size: 1.8rem;
                }

            .mb7_list li:nth-child(3n) a {
                border-right: none;
            }

            .mb7_list li:nth-child(7) a {
                border-bottom: none;
            }

            .mb7_list li:nth-child(8) a {
                border-bottom: none;
            }

            .mb7_list li:nth-child(9) a {
                border-bottom: none;
            }

    .mb7_copy {
        font-family: "STHeiti","Microsoft YaHei","黑体","arial";
        font-size: 0.7rem;
        text-align: center;
    }

    .mb7_footer {
        position: fixed;
        bottom: 0;
        width: 100%;
        background: #000;
        font-family: "STHeiti","Microsoft YaHei","黑体","arial";
    }

        .mb7_footer ul {
            margin-bottom: 0;
            padding-left: 0;
            list-style: none;
        }

        .mb7_footer li {
            float: left;
            width: 25%;
        }

            .mb7_footer li a {
                display: block;
                padding: 0.25rem 0;
                text-align: center;
                font-size: 0.6rem;
                color: #fff;
                text-decoration: none;
            }

                .mb7_footer li a i {
                    display: block;
                    font-size: 1.5rem;
                }
</style>
<div class="page" id="page-index" ng-app="app" ng-controller="APPCtrl">
    <div class="content">
        <div class="content-inner">
            <div class="mb7_top">TEMPLATE</div>
            <div id="topnav" class="com swiper-container mb7_banner" style="height: 175px;">
                <div class="swiper-wrapper">
                    <div class="swiper-slide" ng-repeat="item in coms.topnav.list">
                        <a href="{{getlink(item)}}">
                            <img ng-src="{{item.wxico}}" />
                        </a>
                    </div>
                </div>
                <div class="swiper-pagination swiper-pagination-white"></div>
            </div>

            <div class="mb7_list" id="conbody" class="com">
                <ul>
                    <li ng-repeat="item in coms.conbody.list track by $index"><a href="{{getlink(item)}}" ng-style="getfk(item.wxbk)"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x"></i><i ng-class="item.wxico" class="fa-inverse fa-stack-1x"></i></span><br>{{item.title}}</a></li>

                    <div class="clearfix"></div>
                </ul>
            </div>

            <div class="mb7_copy">&copy;2016 广告 版权所有<br />本网站使用 <a href="#">逐浪CMS</a> 搭建</div>

            <div style="height:58px;"></div>
            <div class="com mb7_footer" id="footbar">
                <ul>
                    <li ng-repeat="item in coms.footbar.list"><a href="{{getlink(item)}}"><i ng-class="item.wxico"></i><span ng-bind="item.title"></span></a></li>
                </ul>
            </div>
        </div>
    </div>
</div>

<link href="/design/h5/css/swiper.min.css" rel="stylesheet" />
<script src="/design/h5/js/swiper.min.js"></script>
<script>
    angular.module("app", []).controller("APPCtrl", function ($scope) {
        Zepto.init();
        Zepto.showIndicator();
        tools.site = "{$site}";
        tools.extend($scope);
        $scope.coms = [];
        //---------------------------------------------------------------------------//
        $scope.coms["topnav"] = { type: "nav", list: [] };
        $scope.coms["conbody"] = { type: "list", list: [] };
        $scope.coms["footbar"] = { type: "footbar", list: [] };
        //---------------------------------------------------------------------------//
        //能否优化为一次取出,然后再划分(微站内容中的数据)
        tools.getdata({ nodename: escape("微站图片") }, function (result) {
            $scope.coms["topnav"].list = result;
            $scope.$digest();
            setTimeout(tools.nav.init, 500);
        })
        tools.getdata({ nodename: escape("微站内容"), dbtype: "footbar" }, function (result) {
            $scope.coms["footbar"].list = result;
            $scope.$digest();
        })
        tools.getdata({ nodename: escape("微站内容"), dbtype: "list" }, function (result) {
            var list = result;
            $scope.coms["conbody"].list = list;
            $scope.$digest();
            Zepto.hideIndicator();
            tools.init();
        });
    });
</script>